import React, { Component } from 'react';
import styles from './index.css';
import MapForm from '@/components/MapFormComponent';
import { FormComponentProps } from 'antd/lib/form';
import _ from 'lodash';
import { DeviceInfo } from '@/models/device';

const { CstTextArea } = MapForm;

interface ImgAndRemarkFormProps {
  onCreate: (form?: FormComponentProps['form']) => void;
  deviceInfo: DeviceInfo;
}

interface ImgAndRemarkFormStates {
}

class ImgAndRemarkForm extends Component<ImgAndRemarkFormProps, ImgAndRemarkFormStates> {

  render() {
    const { onCreate, deviceInfo } = this.props;

    const formItemLayout = {
      labelCol: { span: 8 },
      wrapperCol: { span: 12 },
    };

    return (
      <div className={styles.container}>
        <MapForm onCreate={onCreate}>
          <CstTextArea
            formItemLayout={formItemLayout}
            defaultValue={deviceInfo.remarks}
            type="textarea"
            name="remarks"
          />
        </MapForm>
      </div>
    );
  }
}

export default ImgAndRemarkForm;
